import layoutMain, {LayoutMainState} from './layoutMain'
import {InjectionKey} from 'vue'
import {createStore, Store, useStore as baseUseStore} from 'vuex'
import aside, {AsideState} from './aside'
import breadcrumb, {BreadcrumbState} from './breadcrumb'
import login, {LoginState} from './login'
import {CommonStore} from './vuex_ts'

// 定义根级State类型
export type RootState = {
  aside: AsideState
  login: LoginState
  breadcrumb: BreadcrumbState
  layoutMain: LayoutMainState
}

// 把多个模块聚合在一起
export const modules = {
  login: login,
  aside: aside,
  breadcrumb: breadcrumb,
  layoutMain: layoutMain
}

const store = createStore({
  getters: {},
  modules: modules
})

const key: InjectionKey<Store<RootState>> = Symbol()
// 定义自己的 `useStore` 组合式函数
export function useStore(): CommonStore {
  // return baseUseStore(key);
  return baseUseStore()
}

console.log('状态管理 init', store)

export default store
